Visitando Cosas Sencillas he visto un enlace a Marcofolio donde habla de "8 formas diferentes de añadir bonitos estilos a nuestras listas". Con Explorer el efecto del siguiente ejemplo se pierde, pero aún así no he podido resistirme a probarlo.
Estilos CSS antes de ]]></b:skin>
/* LIST #8 */
#list8 { }
#list8 ul { list-style:none; }
#list8 ul li { font-family:Georgia,serif,Times; font-size:18px; }
#list8 ul li a { display:block; width:300px; height:28px; background-color:#333; border-left:5px solid #222; border-right:5px solid #222; padding-left:10px;
text-decoration:none; color:#bfe1f1; }
#list8 ul li a:hover { -moz-transform:rotate(-5deg); -moz-box-shadow:10px 10px 20px #000000;
-webkit-transform:rotate(-5deg); -webkit-box-shadow:10px 10px 20px #000000;
transform:rotate(-5deg); box-shadow:10px 10px 20px #000000; }
En HTML:
<div id="list8">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
Hola!:D
Me Gustó Mucho!!! Gracias por la información... cuando tenga algo de tiempo para cambiar (pelearme con) el HTML lo voy a probar.
Saludos
yz Todo tuyo JMH :)
disculpame Gem@, sabes como cambiar el texto que aparece al lado de publicar un comentario, que dice: ¨suscripción por correo electronico¨, por una imagen?
Saludos!
Todos se enojan de que Internet Explorer no respete los estándares y Firefox se da sus viajes.
Lo único malo de esto es que nunca lo veremos en ninguna especificación, lo que resulta inútil para diseños serios.
yz HE-MARVEL a ese texto no tenemos acceso, lo único que se puede cambiar si no me equivoco es el color del enlace.
yz Matius eso es como escoger ver la televisión en blanco y negro o en color. Cada uno escoge lo que más le gusta.
Cuando se crea un diseño hay que ser consciente que las visitas pueden utilizar distintos navegadores, no veo por qué prescindir de algo sólo porque un navegador no lo interpreta.
Gracias Gem@, un saludo.
yz Hola Toni, gracias por comentar :)
Felicidades por el blog Gema
Está muy guay:)
Gema, no encuentro el gadget de "La frase del dia", el que cambia cada vez que actualizas la pagina. Me podrías ayudar??
donde esta? cual es??
yz Gracias Mercier :)
yz Bocha yo tampoco sé donde está, k_nelita dice que ella lo añadió desde ahí es cuestión de buscar :O
Buen post Gem@ :D... pero me gustaría hacerte una consulta, no se si se puede hacer una especie de menú desplegable en la sidebar que al expandirlo muestre una serie de imágens... me gustaría saber si se puede hacer eso para poner los banners de las páginas que enlazo sin tener que gastar demasiado espacio en el blog... no se si me explico lo que quiero hacer... :S
Gem@, acabo de fijarme que si tienes eso aqui... :P ... pero no encuentro como hacerlo :S
yz Alexnex ¿aquí dónde? :O
emmm.... jaja.. bueno, mas o menos, lo que quiero hacer es lo que tienes en la sidebar lo que dice "directorios", cuando lo presionas te salen links con imágenes, quisiera hacer lo mismo pero con los banners... me explico?? ... :$:$
hola Gema, espero estes muy bien.
te queria pedir una ayudita en lo siguiente:
en en la parte inferior del reconocido blog Oloblogger existen unos antipixeles organizados de forma horizontal, mi pregunta es, como hago ese orden para que cada antipixel me quede uno al lado de otro???
agradezco tu colaboracion Gemita y gracias de antemano
Hola Gema que sabes tu de la nueva novedad de blogger, verdad que se ve bonita la ventana al crear un post, con el siguiente mensaje:
El servidor API de Google Maps ha rechazado tu solicitud. El parámetro "sensor" especificado en la solicitud debe estar definido en "true" o "false"
Siempre hay novedades en blogger
yz Lo expliqué hace poquitos días, faltaste a clase :D
El efecto que yo tengo se llama slide.
yz HLVS eso lo puedes añadir en un gadget de html del footer (al final del blog)
En su interior añades por ejemplo:
<div class="directorios"> código de los botones uno seguido de otro </div>
De esa forma hemos creado un bloque que más tarde podemos añadir estilos.
A los estilos del bloque le llamaríamos directorios.
yz Hola Henry la nueva novedad :D :D que no vengan muchas así. Ese problema se presenta cuando accedemos al editor por Blogger Draft.
(Es la última novedad creo)
yz El primer comentario anterior era para ti Alexnex, siento el olvido :(
jaja... perdon por faltar a clases es la facultad, me tiene perdido, jaja saludo Gem@ graciass: :)
Holaaa ;) Para Bocha: mirá esta página
Y si vas a la página principal del mismo sitio, tenés millones de gadget de todo tipo y color, pero esa es la de las frases, en el buscador ponés lo que quieras buscar y vualá, ahí está jaja :D
Suerte ;)
yz Alexnex lo primero es lo primro :)
yz k_nelita gracias, gracias, gracias ;)
De nada, de nada, de nada ja jaaa
Estaba mirando la página que recomiendas Marcofolio y realmente la lista mas bonita es la que pusiste gem@, por no decir que es la única que me gusta ja jaa siempre tenemos el mismo gusto ;)
Besotes ♥ ♥ ♥
Acá otro aporte para Bocha, esta vez de la mano de JAVI, que lo vi en su blog y le pregunté, este gadget se actualiza solo no hace falta recargar la página, queda muy bonito y lo podés configurar a tu gusto colores, etc. ENLACE
Espero te sirva Bocha, o alguno de los otros.
Saludos ;)
yz Más gracias k_nelita ;)
Kaixo Gema, me gusta este efecto y me preguntaba si seria posible poner una imagen junto a cada linea, osea (imagen) Home
(Imagen) Blog.....
Gracias :)
Ya lo hice, agregando antes de background color esto:
background:url(url de la imagen) no-repeat left;
left: para la imagen a la izquierda, center para centrarlo y right para la derecha
entonces quedaria algo asi:
/* LIST #8 */
#list8 { }
#list8 ul { list-style:none; }
#list8 ul li { font-family:Georgia,serif,Times; font-size:18px; }
#list8 ul li a { display:block; width:300px; height:28px; url(url de la imagen) no-repeat left; background-color:#333; border-left:5px solid #222; border-right:5px solid #222; padding-left:10px;
text-decoration:none; color:#bfe1f1; }
#list8 ul li a:hover { -moz-transform:rotate(-5deg); -moz-box-shadow:10px 10px 20px #000000;
-webkit-transform:rotate(-5deg); -webkit-box-shadow:10px 10px 20px #000000;
transform:rotate(-5deg); box-shadow:10px 10px 20px #000000; }
;)
Nota: solo los miembros de este blog pueden publicar comentarios.